<?php if(!class_exists("View", false)) exit("no direct access allowed");?><!-- 主内容区 -->
    <main class="flex-1 ml-64 flex flex-col h-screen overflow-hidden" id="mainContent">
        <?php include $_view_obj->compile("main_header.html"); ?>
        
        <!-- 内容区域 -->
        <div class="flex-1 overflow-y-auto p-6 scrollbar-thin">
            <!-- 数据概览 -->
            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-6">
                <div class="bg-white rounded-xl shadow-sm p-5 border border-neutral-200">
                    <div class="flex items-start justify-between mb-4">
                        <div>
                            <p class="text-neutral-500 text-sm">待审核总数</p>
                            <h3 class="text-2xl font-bold mt-1" id="totalCount">1,284</h3>
                        </div>
                        <div class="w-10 h-10 rounded-lg bg-primary/10 flex items-center justify-center text-primary">
                            <i class="fa fa-clock"></i>
                        </div>
                    </div>
                    <div class="flex items-center text-sm" id="totalClaimedHtml">
                        <span class="text-danger flex items-center" >
                            <i class="fa fa-arrow-up mr-1"></i> 12.5%
                        </span>
                        <span class="text-neutral-400 ml-2">较昨日</span>
                    </div>
                </div>
                
                <div class="bg-white rounded-xl shadow-sm p-5 border border-neutral-200">
                    <div class="flex items-start justify-between mb-4">
                        <div>
                            <p class="text-neutral-500 text-sm">今日已审核</p>
                            <h3 class="text-2xl font-bold mt-1" id="totalClaimedTotal">3,642</h3>
                        </div>
                        <div class="w-10 h-10 rounded-lg bg-success/10 flex items-center justify-center text-success">
                            <i class="fa fa-check-circle"></i>
                        </div>
                    </div>
                    <div class="flex items-center text-sm" id="totalClaimedPercent">
                        <span class="text-success flex items-center">
                            <i class="fa fa-arrow-up mr-1"></i> 8.2%
                        </span>
                        <span class="text-neutral-400 ml-2">较昨日</span>
                    </div>
                </div>
                
                <div class="bg-white rounded-xl shadow-sm p-5 border border-neutral-200">
                    <div class="flex items-start justify-between mb-4">
                        <div>
                            <p class="text-neutral-500 text-sm">违规内容</p>
                            <h3 class="text-2xl font-bold mt-1" id="totalViolationTotal">427</h3>
                        </div>
                        <div class="w-10 h-10 rounded-lg bg-danger/10 flex items-center justify-center text-danger">
                            <i class="fa fa-ban"></i>
                        </div>
                    </div>
                    <div class="flex items-center text-sm" id="totalViolationPercent">
                        <span class="text-danger flex items-center">
                            <i class="fa fa-arrow-up mr-1"></i> 5.3%
                        </span>
                        <span class="text-neutral-400 ml-2">较昨日</span>
                    </div>
                </div>
                
                <div class="bg-white rounded-xl shadow-sm p-5 border border-neutral-200">
                    <div class="flex items-start justify-between mb-4">
                        <div>
                            <p class="text-neutral-500 text-sm">平均处理时间</p>
                            <h3 class="text-2xl font-bold mt-1" id="totalAvgHandleTime">4.2 分钟</h3>
                        </div>
                        <div class="w-10 h-10 rounded-lg bg-warning/10 flex items-center justify-center text-warning">
                            <i class="fa fa-line-chart"></i>
                        </div>
                    </div>
                    <div class="flex items-center text-sm" id="totalAvgHandleTimeTrend">
                        <span class="text-success flex items-center">
                            <i class="fa fa-arrow-down mr-1"></i> 12.8%
                        </span>
                        <span class="text-neutral-400 ml-2">较昨日</span>
                    </div>
                </div>
            </div>
            
            <!-- 审核筛选和操作 -->
            <div class="bg-white rounded-xl shadow-sm border border-neutral-200 mb-6 overflow-hidden">
                <div class="p-5 border-b border-neutral-200">
                    <div class="flex flex-wrap items-center justify-between gap-4">
                        <h3 class="font-bold">媒体内容审核</h3>
                        
                        <div class="flex flex-wrap items-center gap-3">
                            <div class="relative">
                                <select class="appearance-none bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-4 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="claimStatusFilter">
                                    <option value="0">全部认领状态</option>
                                    <option value="2">已认领</option>
                                    <option value="1">未认领</option>
                                </select>
                                <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
                            </div>

                            <div class="relative">
                                <select class="appearance-none bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-4 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="contentTypeFilter">
                                    <option value="0">全部类型</option>
                                    <option value="1">图片</option>
                                    <option value="2">视频</option>
                                    <option value="3">音频</option>
                                    <option value="4">文档</option>
                                </select>
                                <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
                            </div>
                            
                            <div class="relative">
                                <select class="appearance-none bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-4 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="statusFilter">
                                    <option value="1">待审核</option>
                                    <option value="2">审核通过</option>
                                    <option value="3">审核拒绝</option>
                                    <option value="4">再次审核</option>
                                    <option value="">全部状态</option>
                                </select>
                                <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
                            </div>
                            
                            <div class="relative">
                                <select class="appearance-none bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-4 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="sortFilter">
                                    <option value="0">默认排序</option>
                                    <option value="1">提交时间 降序</option>
                                    <option value="2">提交时间 升序</option>
                                    <option value="3">优先级 高到低</option>
                                    <option value="4">优先级 低到高</option>
                                </select>
                                <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
                            </div>
                            
                            <button class="bg-primary hover:bg-primary/90 text-white text-sm px-4 py-2 rounded-lg transition-colors" id="filterBtn">
                                <i class="fa fa-filter mr-1"></i> 筛选
                            </button>
                            
                            <button class="bg-neutral-100 hover:bg-neutral-200 text-neutral-700 text-sm px-4 py-2 rounded-lg transition-colors" id="resetBtn">
                                <i class="fa fa-refresh mr-1"></i> 重置
                            </button>
                        </div>
                    </div>
                    
                    <div class="mt-4 grid grid-cols-1 md:grid-cols-4 gap-4">
                        <div>
                            <label class="block text-xs text-neutral-500 mb-1">内容ID/关键词</label>
                            <input type="text" class="w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="keywordSearch">
                        </div>
                        
                        <div>
                            <label class="block text-xs text-neutral-500 mb-1">提交者</label>
                            <input type="text" class="w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="submitterSearch">
                        </div>
                        
                        <div>
                            <label class="block text-xs text-neutral-500 mb-1">提交时间范围</label>
                            <div class="flex space-x-2">
                                <input type="date" class="flex-1 bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="startDate">
                                <span class="flex items-center text-neutral-400">至</span>
                                <input type="date" class="flex-1 bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="endDate">
                            </div>
                        </div>
                        
                        <div>
                            <label class="block text-xs text-neutral-500 mb-1">疑似违规类型</label>
                            <div class="relative">
                                <select class="appearance-none w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" id="violationTypeFilter">
                                    <option value="">全部类型</option>
                                    <option>色情低俗</option>
                                    <option>暴力恐怖</option>
                                    <option>政治敏感</option>
                                    <option>广告营销</option>
                                    <option>垃圾内容</option>
                                </select>
                                <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 在筛选区域下方添加批量操作工具栏 -->
                <div class="p-5 border-b border-neutral-200 flex flex-wrap items-center justify-between gap-4">
                <div class="flex items-center space-x-3">
                    <button class="bg-primary hover:bg-primary/90 text-white text-sm px-4 py-2 rounded-lg transition-colors" id="batchClaimBtn" disabled>
                    <i class="fa fa-hand-paper-o mr-1"></i> 批量认领
                    </button>
                    <button class="bg-success hover:bg-success/90 text-white text-sm px-4 py-2 rounded-lg transition-colors" id="batchApproveBtn" disabled>
                    <i class="fa fa-check mr-1"></i> 批量通过
                    </button>
                    <button class="bg-danger hover:bg-danger/90 text-white text-sm px-4 py-2 rounded-lg transition-colors" id="batchRejectBtn" disabled>
                    <i class="fa fa-times mr-1"></i> 批量拒绝
                    </button>
                    <button class="bg-neutral-100 hover:bg-neutral-200 text-neutral-700 text-sm px-4 py-2 rounded-lg transition-colors" id="batchReviewBtn" disabled>
                    <i class="fa fa-flag mr-1"></i> 批量标记复查
                    </button>
                    <span class="text-sm text-neutral-500 ml-3" id="selectedCount">已选择 0 项</span>
                </div>
                </div>
                
                <!-- 审核列表 -->
                <div class="overflow-x-auto">
                    <table class="w-full" id="contentTable">
                        <thead>
                            <tr class="bg-neutral-50 text-left">
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">
                                    <input type="checkbox" id="selectAll" class="rounded border-neutral-300 text-primary focus:ring-primary">
                                </th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">ID</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">内容预览</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">内容信息</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">认领状态</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">审核状态</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">AI预审</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">提交信息</th>
                                <th class="px-5 py-3 text-xs font-medium text-neutral-500 uppercase tracking-wider">操作</th>
                            </tr>
                        </thead>
                        <tbody class="divide-y divide-neutral-200 bg-white" id="contentTableBody">
                            
                        </tbody>
                    </table>
                </div>

                
                
                <!-- 分页 -->
                <div class="px-5 py-4 border-t border-neutral-200 flex items-center justify-between">
                    <div class="text-sm text-neutral-500 pagenation">
                        显示 1 至 5 条，共 128 条
                    </div>
                    <div class="flex space-x-1">
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 text-neutral-400 hover:border-primary hover:text-primary disabled:opacity-50" disabled>
                            <i class="fa fa-angle-left"></i>
                        </button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-primary bg-primary text-white">1</button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 hover:border-primary hover:text-primary">2</button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 hover:border-primary hover:text-primary">3</button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 hover:border-primary hover:text-primary">4</button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 hover:border-primary hover:text-primary">5</button>
                        <button class="w-8 h-8 flex items-center justify-center rounded border border-neutral-200 hover:border-primary hover:text-primary">
                            <i class="fa fa-angle-right"></i>
                        </button>
                    </div>
                </div>

                
            </div>

        </div>
    </main>

    <!-- 调整审核操作确认模态框 -->
    <div class="fixed inset-0 bg-black/50 z-50 hidden items-center justify-center" id="confirmModal">
    <div class="bg-white rounded-xl w-full max-w-md p-6">
        <h3 class="text-lg font-bold mb-2" id="modalTitle">审核确认</h3>
        <p class="text-neutral-500 mb-4" id="modalMessage">您确定要执行此操作吗？</p>
        <!-- 批量操作时显示选中数量 -->
        <div class="mb-4 hidden" id="batchInfo">
        <p class="text-sm text-neutral-500 p-2 bg-neutral-100 rounded-lg" id="selectedItemsCount"></p>
        </div>
        <div class="mb-4">
        <label class="block text-sm font-medium mb-1">审核备注（可选）</label>
        <textarea class="w-full border border-neutral-200 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" rows="3" placeholder="请输入审核备注..."></textarea>
        </div>
        <div class="flex space-x-3">
        <button class="flex-1 py-2 border border-neutral-200 rounded-lg hover:bg-neutral-50 transition-colors" id="cancelBtn">取消</button>
        <button class="flex-1 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors" id="confirmBtn">确认</button>
        </div>
    </div>
    </div>

    <!--认领模态框-->
    <div class="fixed inset-0 bg-black/50 z-50 hidden items-center justify-center" id="claimModal">
        <div class="bg-white rounded-xl w-full max-w-md p-6">
            <h3 class="text-lg font-bold mb-2">认领任务</h3>
            <p class="text-neutral-500 mb-4" id="claimMessage">您确定要认领此任务吗？认领后其他审核员将无法操作。</p>
            <div class="flex space-x-3">
            <button class="flex-1 py-2 border border-neutral-200 rounded-lg hover:bg-neutral-50 transition-colors" id="cancelClaimBtn">取消</button>
            <button class="flex-1 py-2 bg-primary text-white rounded-lg hover:bg-primary/90 transition-colors" id="confirmClaimBtn">确认认领</button>
            </div>
        </div>
    </div>

    <!-- 拒绝原因模态框 -->
    <div id="rejectModal" class="fixed inset-0 bg-black/50 z-50 hidden items-center items-center justify-center">
    <div class="bg-white rounded-xl w-full max-w-md p-6 border border-neutral-200 shadow-sm">
        <div class="flex items-center justify-between mb-4">
        <h3 class="text-lg font-bold">选择拒绝类型</h3>
        <button type="button" class="text-neutral-400 hover:text-neutral-600" id="closeRejectModal">
            <i class="fa fa-times"></i>
        </button>
        </div>
        
        <div class="space-y-4">
        <div>
            <label class="block text-sm font-medium text-neutral-700 mb-1">拒绝原因</label>
            <div class="relative">
            <select id="rejectTypeSelect" class="appearance-none w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 pr-8 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" required>
                <option value="">请选择拒绝类型</option>
                <option value="31">涉黄</option>
                <option value="32">涉政</option>
                <option value="33">广告</option>
                <option value="34">其他</option>
            </select>
            <i class="fa fa-chevron-down absolute right-3 top-1/2 -translate-y-1/2 text-neutral-400 text-xs pointer-events-none"></i>
            </div>
        </div>
        
        <div>
            <label class="block text-sm font-medium text-neutral-700 mb-1">备注（可选）</label>
            <textarea id="rejectRemark" class="w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" rows="3" placeholder="请输入拒绝原因备注"></textarea>
        </div>
        </div>
        
        <div class="flex space-x-3 mt-6">
        <button id="cancelReject" type="button" class="flex-1 py-2 border border-neutral-200 rounded-lg hover:bg-neutral-50 transition-colors text-neutral-700">
            取消
        </button>
        <button id="confirmReject" type="button" class="flex-1 py-2 bg-danger text-white rounded-lg hover:bg-danger/90 transition-colors">
            确认拒绝
        </button>
        </div>
    </div>
    </div>
    <!-- 复查标记模态框 -->
<div id="reviewModal" class="fixed inset-0 bg-black/50 z-50 hidden items-center justify-center">
    <div class="bg-white rounded-xl w-full max-w-md p-6 border border-neutral-200 shadow-sm">
        <div class="flex items-center justify-between mb-4">
            <h3 class="text-lg font-bold">标记复查</h3>
            <button type="button" class="text-neutral-400 hover:text-neutral-600" id="closeReviewModal">
                <i class="fa fa-times"></i>
            </button>
        </div>
        
        <div class="space-y-4">
            <div>
                <label class="block text-sm font-medium text-neutral-700 mb-1">复查原因（可选）</label>
                <textarea id="reviewRemark" class="w-full bg-neutral-100 border border-neutral-200 text-sm rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary" rows="3" placeholder="请输入需要复查的原因"></textarea>
            </div>
        </div>
        
        <div class="flex space-x-3 mt-6">
            <button id="cancelReview" type="button" class="flex-1 py-2 border border-neutral-200 rounded-lg hover:bg-neutral-50 transition-colors text-neutral-700">
                取消
            </button>
            <button id="confirmReview" type="button" class="flex-1 py-2 bg-warning text-white rounded-lg hover:bg-warning/90 transition-colors">
                确认标记
            </button>
        </div>
    </div>
</div>


<!-- 媒体预览弹窗 -->
<div id="mediaPreviewModal" class="fixed inset-0 bg-black/80 z-50 hidden items-center justify-center p-4">
    <div class="relative max-w-5xl w-full max-h-[90vh] overflow-hidden rounded-lg">
        <!-- 关闭按钮 -->
        <button id="closeMediaModal" class="absolute top-4 right-4 w-8 h-8 rounded-full bg-black/50 text-white flex items-center justify-center z-10 hover:bg-black/70 transition-colors">
            <i class="fa fa-times"></i>
        </button>
        
        <!-- 图片容器 -->
        <div id="imageContainer" class="hidden">
            <img id="previewImage" src="" alt="预览图片" class="max-w-full max-h-[90vh] object-contain">
        </div>
        
        <!-- 视频容器 -->
        <div id="videoContainer" class="hidden w-full">
            <video id="previewVideo" class="w-full max-h-[90vh] object-contain" controls>
                <source src="" type="video/mp4">
                您的浏览器不支持视频播放
            </video>
        </div>
        
        <!-- 文章容器 -->
        <div id="articleContainer" class="hidden w-full h-full bg-white">
            <iframe id="articleIframe" src="" frameborder="0" class="w-full h-full"></iframe>
        </div>
    </div>
</div>


<!-- 音频播放控件 (会动态插入到对应行) -->
<div id="audioPlayerTemplate" class="hidden">
    <div class="audio-player flex items-center space-x-2 mt-2">
        <button class="audio-play-btn w-6 h-6 bg-primary text-white rounded-full flex items-center justify-center">
            <i class="fa fa-play"></i>
        </button>
        <audio class="audio-source" controls style="display: none;"></audio>
        <div class="audio-progress flex-1 h-1 bg-neutral-200 rounded-full overflow-hidden">
            <div class="audio-progress-bar h-full bg-primary w-0"></div>
        </div>
        <span class="audio-time text-xs text-neutral-500">00:00</span>
    </div>
</div>

<script src="/i/js/main.js?t=242"></script>
